let form = layui.form;
let layer = layui.layer;

initEditor();

// 获取文章分类
function getCategory() {
    $.ajax({
        url: '/my/category/list',
        success: function (res) {
            if (res.status === 0) {
                let arr = [];
                res.data.forEach(item => {
                    // 获取下拉 分类id 和 分类名称
                    arr.push(`<option value="${item.id}">${item.name}</option>`);
                });
                $('.categoryKind').append(arr.join(''));
                form.render();
            }
        }
    })
}
getCategory();

// 剪裁框

let $image = $('#image')

let options = {
    aspectRatio: 16 / 9,
    preview: '.img-preview'
}

$image.cropper(options);

// 上传文件重新加载
$('#file').change(function () {
    let fileObj = this.files[0];
    let url = URL.createObjectURL(fileObj);
    $image.cropper('destroy').attr('src', url).cropper(options);
});

// 提交表单  阻止表单自动提交 收集表单  Ajax提交
$('.layui-form').on('submit', function (e) {
    e.preventDefault();
    let data = new FormData(this);
    data.set('content', tinyMCE.activeEditor.getContent());
    // data.forEach(item => {
    //     console.log(item);
    // })
    // 二进制大对象
    let canvas = $image.cropper('getCroppedCanvas', { width: 400, height: (400 * 9 / 16) });
    // 把canvas图片转成二进制形式
    canvas.toBlob(function (blob) {
        // 追加文件对象到data中
        data.append('cover_img', blob);

        $.ajax({
            type: 'POST',
            url: '/my/article/add',
            data: data,
            // 不要处理数据；意思是不要把对象形式的fd转换成查询字符串形式
            processData: false,
            // 不要加默认的请求头（application/x-www-form-urlencoded），让浏览器自行设置请求头
            contentType: false,
            success: function (res) {
                if (res.status === 0) {
                    //提示成功1秒后跳转到文章列表
                    layer.msg(res.message, { time: 1000 }, function () {
                        location.href = './list.html';
                    });
                }
            },
            // 提交错误提示信息
            error: function (xhr) {
                let res = xhr.responseJSON;
                layer.msg(res.message);
            }
        })
    })
})

// 选择文件事件
$('.layui-btn-danger').on('click', function (e) {
    e.preventDefault();
    $('#file').trigger('click');
})